<template>
	<div class="img">
		<img src="@im1/title.png" class="title">
	</div>
	<el-row class="row">
		<el-col :span="7">
			<el-scrollbar height="100%">
				<L1 />
				<L2 />
				<L3 />
			</el-scrollbar>
		</el-col>
		<el-col :span="10">
			<Centre />
		</el-col>
		<el-col :span="7">
			<el-scrollbar height="100%">
				<R1 />
				<R2 />
			</el-scrollbar>
		</el-col>
	</el-row>
</template>

<script setup>
import L1 from '@com1/L1.vue';
import L2 from '@com1/L2.vue';
import L3 from '@com1/L3.vue';
import Centre from '@com1/Centre.vue';
import R1 from '@com1/R1.vue';
import R2 from '@com1/R2.vue';
</script>

<style lang="less" scoped>
@import '@less';

.img {
	.df();
	.f_ai();
	.f_jc();

	.title {
		.h(50px);
	}
}

.row {
	.size(100%, calc(100% - 50px));
}

.el-col {
	.h(100%);
	.padd(10px);
}
</style>